<ion-header>
  <ion-navbar [hideBackButton]="true">
    <button class="talk-about img-icon" (click)="goTalkAbout(1)" [ngClass]="weiliao.css">{{weiliao.txt}}</button>
    <div class="search">
      <i class="search-icon"></i>
      <input type="search" (click)="SearchClick()" placeholder="搜索你感兴趣的" id="inputh" class="input_search" />
    </div>
    <button class="massages img-icon news-img  " (click)="goTalkAbout(2)"></button>
  </ion-navbar>
</ion-header>
<ion-content>
  <ion-refresher (ionRefresh)="doRefresh($event)">
    <ion-refresher-content pullingIcon="arrow-dropdown" pullingText="下拉刷新..." refreshingSpinner="circles" refreshingText="请稍等...">
    </ion-refresher-content>
  </ion-refresher>
  <ion-slides pager autoplay="3000" speed="2000" loop="true" autoplayDisableOnInteration="true" *ngIf="len >=1">
    <ion-slide *ngFor="let item of slidesList">
      <img src="{{item.ImgUrl | imgUrl:'base64'}}" />
    </ion-slide>
  </ion-slides>
  <div class="sesion—button">
    <ul>
      <li *ngFor="let item of SesionBtnlist">
        <div>
          <img src="{{item.src}}" (click)="btnIndex( item.name )">
          <label for="">{{item.txt}}</label>
        </div>
      </li>
    </ul>
  </div>
  <div class="uh bc-head ubb bc-f6">
    <div class="ub" id="nav">
      <div class="ub-f1" [ngClass]="{'act': isnav}" (click)="Chenked_tiaozhan(0)"> 推荐挑战 </div>
      <div class="ub-f1" [ngClass]="{'act': !isnav}" (click)="Chenked_tiaozhan(1)"> 同城挑战 </div>
    </div>
  </div>
  <div [hidden]="!isnav" class="ion-card-list">
    <div *ngFor="let item of recomlist" class="ub-img1  tiaozhan_wh" (click)="openChangeDetial(item,0)" [ngStyle]="{'background-image': item.PicUrl | imgUrl:'DynamicUrl':'backImg'}">
      <div class="ub ub-ac ub-pc ub-ver  ub-con font_white" style="olor: #FFF;  position: absolute; top: 0; width: 100%; height: 12em;background-color: rgba(0,0,0,0.5);">
        <div class="ub ub-ac">
          <div class="ub-f1 width_hr ubb"></div>
          <img src="{{item.Pattern | dataWallet:'PatternIMg'}}" style="width: 2.5em;height: 2.5em;margin: 0.3em;" />
          <div class="ub-f1 width_hr ubb"></div>
        </div>
        <div>
          <h2>{{item.Title}}</h2>
        </div>
        <div class="ub fontsize8 umar-t">
          <div>{{item.Pattern | dataWallet:"Pattern" }}</div>
          <div class="l_mar_r"> | </div>
          <div> {{item.Classify | dataWallet:'Classify'}} </div>
        </div>
        <div class="ub ub-ac umar-t">
          <div class="ub-img1 user_wh umar-r">
            <img class="user_wh" src="{{item.HeadPortrait | imgUrl:'HeadportraitUrl' }}">
          </div>
          <div class="umar-r"> {{item.username}} </div>
          <div class="umar-r"> {{item.Integral}}</div>
          <div class="ub-img1 zuanshi_wh zuanshi_img umar-r"></div>
        </div>
      </div>
    </div>
    <list-bottom *ngIf="!(doRefreshData[0].forbidFinite)"></list-bottom>
  </div>
  <div [hidden]="isnav" class="ion-card-list">
    <div *ngFor="let item of CityList" class="ub-img1  tiaozhan_wh" (click)="openChangeDetial(item,1)" [ngStyle]="{'background-image': item.PicUrl | imgUrl:'DynamicUrl':'backImg'}">
      <div class="ub ub-ac ub-pc ub-ver  ub-con font_white" style="olor: #FFF;  position: absolute; top: 0; width: 100%; height: 12em;background-color: rgba(0,0,0,0.5);">
        <div class="ub ub-ac">
          <div class="ub-f1 width_hr ubb"></div>
          <img src="{{item.Pattern | dataWallet:'PatternIMg'}}" style="width: 2.5em;height: 2.5em;margin: 0.3em;" />
          <div class="ub-f1 width_hr ubb"></div>
        </div>
        <div>
          <h2>{{item.Title}}</h2>
        </div>
        <div class="ub fontsize8 umar-t">
          <div>{{item.Pattern | dataWallet:"Pattern" }}</div>
          <div class="l_mar_r"> | </div>
          <div> {{item.Classify | dataWallet:'Classify'}} </div>
        </div>
        <div class="ub ub-ac umar-t">
          <div class="ub-img1 user_wh umar-r">
            <img class="user_wh" src="{{item.HeadPortrait | imgUrl:'HeadportraitUrl' }}">
          </div>
          <div class="umar-r"> {{item.username}} </div>
          <div class="umar-r"> {{item.Integral}}</div>
          <div class="ub-img1 zuanshi_wh zuanshi_img umar-r"></div>
        </div>
      </div>
    </div>
    <list-bottom *ngIf="!(doRefreshData[1].forbidFinite)"></list-bottom>
  </div>
  <ion-infinite-scroll *ngIf="infiniteScroll" (ionInfinite)="doInfinite($event)">
    <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="加载更多......">
    </ion-infinite-scroll-content>
  </ion-infinite-scroll>
</ion-content>